<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/resultList.css">
    <link rel="stylesheet" href="../css/userCenter.css">
    <script type="text/javascript" src="../js/jquery-1.7.2.js"></script>
</head>
<body>
<div class="header">
    <div class="container">
        <div class="left">
            <a href="" class="logo">
                <img src="../images/topLogo.png" alt="">
            </a>
            <span>
                个人中心
            </span>
        </div>
        <div class="right">
            <a href="" class="userInfo">
                <img src="../images/userLogo.png" alt="">
            </a>
            <a href="" class="loginOut">
                <span>退出</span>
            </a>
        </div>
    </div>
</div>
<div class="userCenterCon">
    <div class="container clearfix">
        <div class="left">
            <ul>
                <li class="active">
                    <a href="">我的词条</a>
                </li>
                <li>
                    <a href="">我的消息</a>
                </li>
                <li>
                    <a href="">基本设置</a>
                </li>
                <li>
                    <a href="">账号设置</a>
                </li>
            </ul>
        </div>
        <div class="right">
            <div class="userCenTab">
                <span class="active" >已通过</span>
                <span>待通过</span>
                <span>未通过</span>
                <span>草稿箱</span>
            </div>
            <div class="userCenList">
                <!--已通过-->
                <div class="userPass userTable" >
                    <table id="userPass"  align='center' style="border-collapse:collapse;">
                        <thead >
                            <tr bgcolor="#f0f0f0">
                                <th width="170">
                                    词条名称
                                </th>
                                <th width="146">
                                    版本
                                </th>
                                <th width="226">
                                    通过时间
                                </th>
                                <th width="193">
                                    被他人修改版本
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr >
                                <td>以太坊</td>
                                <td> 创始版本</td>
                                <td>
                                    2018-12-12 12:30:05
                                </td>
                                <td>
                                    无
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div class="pagination">
                        <ul>
                            <li>
                                <a href="" class="active">1</a>
                            </li>
                            <li>
                                <a href="">2</a>
                            </li>
                            <li>
                                <a href="">3</a>
                            </li>
                            <li>
                                <a href="">4</a>
                            </li>
                            <li>
                                <a href="">5</a>
                            </li>
                            <li>
                                <a href="">&gt;</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="userWait userTable" >
                    <table id="userWait"  align='center' style="border-collapse:collapse;" >
                        <thead >
                            <tr bgcolor="#f0f0f0">
                                <th width="170">
                                    词条名称
                                </th>
                                <th width="280">
                                    版本
                                </th>
                                <th width="286">
                                    提交时间
                                </th>

                            </tr>
                        </thead>
                            <tbody>
                                <tr >
                                    <td>以太坊</td>
                                    <td> 创始版本</td>
                                    <td>
                                        2018-12-12 12:30:05
                                    </td>

                                </tr>
                            </tbody>
                    </table>

                </div>
                <div class="userReject userTable" >
                    <table id="userReject"  align='center' style="border-collapse:collapse;" >
                        <thead >
                            <tr bgcolor="#f0f0f0">
                                <th width="128">
                                    词条名称
                                </th>
                                <th width="126">
                                    未通过原因
                                </th>
                                <th width="136">版本</th>
                                <th width="172">
                                    提交时间
                                </th>
                                <th width="172">
                                    审核时间
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr >
                                <td>以太坊</td>
                                <td><a class="checkReason">查看</a></td>
                                <td> 创始版本</td>
                                <td>
                                    2018-12-12 12:30:05
                                </td>
                                <td>
                                    2018-12-12 12:30:05
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="userDraft userTable" >
                    <table id="userDraft"  align='center' style="border-collapse:collapse;" >
                        <thead >
                        <tr bgcolor="#f0f0f0">
                            <th width="230">
                                词条名称
                            </th>
                            <th width="280">
                                提交时间
                            </th>
                            <th width="226">操作</th>

                        </tr>
                        </thead>
                        <tbody >
                            <tr >
                                    <td>
                                        <div  class="remberLoginLable">
                                            <input type="checkbox" id="remberLogin">
                                            <label  class="label"  for="remberLogin"> </label>
                                            <label  class="noselect"  for="remberLogin">以太坊1</label>
                                        </div>
                                    </td>
                                    <td>2018-12-12 12:30:05</td>
                                    <td class="userDel"> 删除</td>
                            </tr>
                            <tr >
                                    <td>
                                        <div  class="remberLoginLable">
                                            <input type="checkbox" id="remberLogin2">
                                            <label  class="label"  for="remberLogin2"> </label>
                                            <label  class="noselect"  for="remberLogin2">以太坊2</label>
                                        </div>
                                    </td>
                                    <td>2018-12-12 12:30:05</td>
                                    <td class="userDel"> 删除</td>
                            </tr>
                            <tr >
                                    <td>
                                        <div  class="remberLoginLable">
                                            <input type="checkbox" id="remberLogin3">
                                            <label  class="label"  for="remberLogin3"> </label>
                                            <label  class="noselect"  for="remberLogin3">以太坊3</label>
                                        </div>
                                    </td>
                                    <td>2018-12-12 12:30:05</td>
                                    <td class="userDel"> 删除</td>
                            </tr>
                            <tr >
                                <td>
                                    <div  class="remberLoginLable">
                                        <input type="checkbox" id="remberLogin4">
                                        <label  class="label"  for="remberLogin4"> </label>
                                        <label  class="noselect"  for="remberLogin4">以太坊4</label>
                                    </div>
                                </td>
                                <td>2018-12-12 12:30:05</td>
                                <td class="userDel"> 删除</td>
                            </tr>
                            <tr >
                                <td>
                                    <div  class="remberLoginLable">
                                        <input type="checkbox" id="remberLogin5">
                                        <label  class="label"  for="remberLogin5"> </label>
                                        <label  class="noselect"  for="remberLogin5">以太坊5</label>
                                    </div>
                                </td>
                                <td>2018-12-12 12:30:05</td>
                                <td class="userDel"> 删除</td>
                            </tr>

                            <tr >
                                <td>
                                    <div  class="remberLoginLable">
                                        <input type="checkbox" id="remberLogin6">
                                        <label  class="label"  for="remberLogin6"> </label>
                                        <label  class="noselect"  for="remberLogin6">以太坊6</label>
                                    </div>
                                </td>
                                <td>2018-12-12 12:30:05</td>
                                <td class="userDel"> 删除</td>
                            </tr>
                        </tbody>
                        <tfoot>
                            <tr>
                                <td>
                                    <div  class="remberLoginLable ">
                                        <input type="checkbox" id="checkAll">
                                        <label  class="label checkAll" for="checkAll"> </label>
                                        <label  class="noselect  checkAll" for="checkAll">全选</label>
                                    </div>
                                </td>
                                <td>

                                </td>
                                <td class="deleteAllBtn">
                                    删除
                                </td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="layer" >
    <div class="tc">
        <div class="tcTop">
            <a class="tcClose">
                <img src="../images/close.png" alt="">
            </a>
        </div>
        <p class="tcTitle">未通过原因</p>
        <div class="tcContent">
            <p class="layerDeclare">
                链百科严正声明 ：词条创建和修改都是免费，绝不存在官方及代理商付费代编，
                请勿上当受骗，欢迎举报。
            </p>
            <p>
                可能存在的问题：
            </p>
            <p style="color: #4982ff;font-size: 16px">
                您编辑的词条内容缺乏参考资料的佐证，或您提供的某个或某些参考资料不可信。
            </p>
            <p>
                1、不可使用带有免责声明（不对内容真实性做保证）的参考资料
            </p>
            <p>
                2、不可使用带有免责声明（不对内容真实性做保证）的参考资料
            </p>
            <p>
                1、不可使用带有免责声明（不对内容真实性做保证）的参考资料
            </p>
            <p>
                2、不可使用带有免责声明（不对内容真实性做保证）的参考资料
            </p>
        </div>
    </div>
</div>

<div class="footer">
    <p >
        Copyright：2018 链百科 鄂ICP证030173号
    </p>
    <p>
        武汉市代劳科技有限责任公司-链百科团队出品
    </p>
</div>
<script>
//查看原因
    $('.checkReason').on('click',function () {
        if($('.layer').css('display')=='none'){
            $('.layer').fadeIn(300)
        }
    })
    $('.tcClose').on('click',function () {
        $('.layer').fadeOut(300)
    });
    //切换tab
    $('.userCenTab span').on('click',function (e) {
        $(this).addClass('active').siblings().removeClass('active')
        var index =$(this).index()

        $('.userCenList').find('div.userTable').eq(index).show().siblings().hide()
    })
    //全选删除
    $('.checkAll').on('click',function (e) {
        for(var i=0;i<$('#userDraft tbody tr').length;i++){
            $('#userDraft tbody tr').eq(i).find('input[type="checkbox"]')[0].checked
                =!$(this).parents('tr').find('input[type="checkbox"]')[0].checked
            }
    })
    //删除操作
    //部分删除
    $('.userDel').on('click',function (e) {
            var index =$(this).parents('tr').index()
            $('#userDraft').find(' tbody tr').eq(index).remove()
    })
    //删除选中部分
    $('.deleteAllBtn').on('click',function (e) {
        var length =$('#userDraft tbody tr').length
        var newArray =new Array()
        for(var i=0;i<length;i++){
            if($('#userDraft tbody tr').eq(i).find('input').attr('checked')){
                newArray.push(i)
            }
        }
        newArray =newArray.map(function(value,index){
            console.log(value,index)
            return value-index
        })
        newArray.forEach(function(index){
            $('#userDraft tbody tr').eq(index).remove()
        })
        $('#userDraft tfoot tr').eq(0).find('input').attr('checked',false)

    })

</script>
</body>
</html>